<template>
  <div>
    申请管理
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="bankCard" label="卡号" width="180" />
      <el-table-column prop="balance" label="申请金额" width="180" />
      <el-table-column
        prop="isType"
        label="申请类型"
        width="180"
        v-slot="scope"
      >
        <el-tag type="primary" v-if="scope.row.isType === 1">定期转活期</el-tag>
        <el-tag type="success" v-else-if="scope.row.isType > 1">
          活期转定期
        </el-tag>
      </el-table-column>
      <el-table-column prop="createTime" label="申请时间" width="180" />
      <el-table-column prop="status" label="状态" width="180" v-slot="scope">
        <el-tag type="primary" v-if="scope.row.status === 0">未处理</el-tag>
        <el-tag type="success" v-else-if="scope.row.status === 1">
          已通过
        </el-tag>
        <el-tag type="danger" v-else-if="scope.row.status === 2">未通过</el-tag>
      </el-table-column>
      <el-table-column label="操作" width="300" v-slot="scope">
        <el-button
          v-if="scope.row.status === 0"
          type="primary"
          @click="save(scope.row)"
        >
          确认申请
        </el-button>
        <el-button
          v-if="scope.row.status === 0"
          type="danger"
          @click="reject(scope.row)"
        >
          取消申请
        </el-button>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup>
import { ref, reactive } from 'vue'
import {
  confirmApplication,
  rejectApplication,
  showApplication,
} from '@/api/bank'
import { ElMessage } from 'element-plus'
const tableData = ref([])

function showList() {
  showApplication().then(res => {
    tableData.value = res.data
    console.log(res.data)
  })
}

showList()

function save(row) {
  confirmApplication(row.id).then(res => {
    if (res.code === 200) {
      ElMessage({
        message: res.message,
        type: 'success',
      })
    } else {
      ElMessage({
        message: res.message,
        type: 'error',
      })
    }
    showList()
  })
}
function reject(row) {
  rejectApplication(row.id).then(res => {
    if (res.code === 200) {
      ElMessage({
        message: res.message,
        type: 'success',
      })
    } else {
      ElMessage({
        message: res.message,
        type: 'error',
      })
    }
    showList()
  })
}
</script>

<style scoped></style>
